我們已經知道在 JavaScript 產生執行環境時會經歷兩個階段,
第一個階段是創造階段我們已經講過了,
會幫我們創造全域物件、特殊變數 this 、外部環境,
以及將變數與函數設定到對應的記憶體空間裡,
再來看看第二個階段,
第二個階段是執行階段,
執行階段會逐行編譯、轉換你的程式碼,
轉換成電腦看的懂的東西(指令),
圖片來源:JavaScript 全攻略:克服 JS 的奇怪部分課程第 2 節講座 12 影片截圖
我們再次透過 Hoisting 的例子來看執行階段:
function b() {
console.log('Called b!');
}
b();
console.log(a);
var a = 'Hello World!';
console.log(a);
在創造階段,我們設定了 函數b
,
然後 var a
被設定為 undefined
,
現在我們來看執行階段程式碼被執行的過程,
當第五行被執行了,呼叫 函數b
, 函數b
被呼叫會輸出 Called b!
到 Console ,
當七行被執行了,輸出 變數a
到 Console,
因為 a
在創造階段被設為 undefined
所以會看輸出結果為 undefined
,
當執行到第九行,把記憶體中 a
的值設定為 Hello World!
字串,
當執行到第十一行,現在a
在記憶體中的值是 Hello World!
所以輸出 Hello World!
到 Console ,
接著打開 Chrome 來看 Console 中的結果是否跟我們預期的一樣,
Console 中的結果:
由此可知,執行環境在執行階段時,程式碼是逐行被執行的,
語法解析器逐行將程式碼,一字一行的編譯、轉換成電腦看的懂的東西,以便讓電腦執行。